<!DOCTYPE html>
<html ng-app="app" ng-controller="indexCtrl">

	<head lang="en">
		<meta charset="UTF-8">
		<meta http-equiv="Expires" content="0">
		<meta http-equiv="Pragma" content="no-cache">
		<meta http-equiv="Cache-control" content="no-cache">
		<meta http-equiv="Cache" content="no-cache">
		<title>广告投放-广告主</title>
		<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" id="favicon">
		<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/bootstrap-datetimepicker.min.css" />
		<link rel="stylesheet" href="css/base.css" />
		<link rel="stylesheet" href="modules/agent/agCreative/agCreative.css" />
		<link rel="stylesheet" href="../../oem/css/common.css" />
		<style>

		</style>
	</head>

	<body>
		<div class="nav_top">
			<div class="logo fl" id="logo">
			</div>
			<ul class="nav_list fl">
				<!-- ngIf: permission.view['首页'] -->
				<li ng-if="permission.view['首页']" class="ng-scope">
					<a ui-sref="agent.home" ui-sref-active="active" href="./agentIndex.html" class="">首页</a>
				</li>
				<!-- end ngIf: permission.view['首页'] -->
				<!-- ngIf: permission.view['投放管理'] -->
				<li ng-if="permission.view['投放管理']" class="ng-scope">
					<!--<a ui-sref="agent.delivery" ui-sref-active="active">投放管理</a>-->
					<a href="./active.html" class="toFirstSub active">投放管理</a>
					<ul class="nav_dropdown" style="width: 1903px;">
						<!-- ngIf: permission.view['投放管理'].sub['活动管理'] -->
						<li ng-if="permission.view['投放管理'].sub['活动管理']" class="ng-scope">
							<a href="./active.html" ui-sref-active="active" ui-sref="agent.delivery.active" class="">活动管理</a>
						</li>
						<!-- end ngIf: permission.view['投放管理'].sub['活动管理'] -->
						<!-- ngIf: permission.view['投放管理'].sub['订单管理'] -->
						<li ng-if="permission.view['投放管理'].sub['订单管理']" class="ng-scope">
							<a href="./order.html" ui-sref-active="active" ui-sref="agent.delivery.order" class="">订单管理</a>
						</li>
						<!-- end ngIf: permission.view['投放管理'].sub['订单管理'] -->
						<!-- ngIf: permission.view['投放管理'].sub['素材信息'] -->
						<li ng-if="permission.view['投放管理'].sub['素材信息']" class="ng-scope">
							<a href="./creative.html" ui-sref-active="active" ui-sref="agent.delivery.creative" class="">素材信息</a>
						</li>
						<!-- end ngIf: permission.view['投放管理'].sub['素材信息'] -->
						<!-- ngIf: permission.view['投放管理'].sub['APP监测'] -->
						<li ng-if="permission.view['投放管理'].sub['APP监测']" class="ng-scope">
							<a href="./audiences.html" ui-sref-active="active" ui-sref="agent.delivery.audiences" class="">监测管理</a>
						</li>
						<!-- end ngIf: permission.view['投放管理'].sub['APP监测'] -->
						<!-- ngIf: hasDepot -->
					</ul>
				</li>
				<!-- end ngIf: permission.view['投放管理'] -->
				<!-- ngIf: permission.view['报表中心'] -->
				<li ng-if="permission.view['报表中心']" class="ng-scope">
					<!--<a ui-sref="agent.report" ui-sref-active="active">报表</a>-->
					<a href="./baoBiao.html" class="toFirstSub" ng-class="{'active':$state.includes('agent.report.*')}">报表中心</a>
					<ul class="nav_dropdown" style="width: 1903px;">
						<!-- ngIf: permission.view['报表中心'].sub['效果报表'] -->
						<li ng-if="permission.view['报表中心'].sub['效果报表']" class="ng-scope">
							<a href="./baoBiao.html" ui-sref-active="active" ui-sref="agent.report.effect({'activeID':'0','activeName':'0','orderID':'0','orderName':'0'})" class="">效果报表</a>
						</li>
						<!-- end ngIf: permission.view['报表中心'].sub['效果报表'] -->
						<li ng-if="permission.view['合约报表'].sub['效果报表']" class="ng-scope">
							<a href="./heyuebaobiao.html" ui-sref-active="active" ui-sref="agent.report.effect({'activeID':'0','activeName':'0','orderID':'0','orderName':'0'})" class="">合约报表</a>
						</li>
					</ul>
				</li>
				<!-- end ngIf: permission.view['报表中心'] -->
				<!-- ngIf: permission.view['系统管理'] -->
				<li ng-if="permission.view['系统管理']" class="ng-scope">
					<a href="./baseInfo.html" class="toFirstSub" ng-class="{'active':$state.includes('agent.manage.*')}">系统管理</a>
					<ul class="nav_dropdown" style="width: 1903px;">
						<!-- ngIf: permission.view['系统管理'].sub['基本信息'] -->
						<li ng-if="permission.view['系统管理'].sub['基本信息']" class="ng-scope">
							<a href="./baseInfo.html" ui-sref-active="active" ui-sref="agent.manage.baseInfo" class="">基本信息</a>
						</li>
						<!-- end ngIf: permission.view['系统管理'].sub['基本信息'] -->
						<!-- ngIf: permission.view['系统管理'].sub['资质管理'] -->
						<li ng-if="permission.view['系统管理'].sub['资质管理']" class="ng-scope">
							<a href="./qualifications.html" ui-sref-active="active" ui-sref="agent.manage.qualifications" class="">资质管理</a>
						</li>
						<!-- end ngIf: permission.view['系统管理'].sub['资质管理'] -->
					</ul>
				</li>
				<!-- end ngIf: permission.view['系统管理'] -->
				<!-- ngIf: permission.view['财务管理'] -->
				<li ng-if="permission.view['财务管理']" class="ng-scope">
					<!--<a ui-sref="agent.finance" ui-sref-active="active">财务管理</a>-->
					<a href="./caiwu.html" class="toFirstSub" ng-class="{'active':$state.includes('agent.finance.*')}">财务管理</a>
					<ul class="nav_dropdown" style="width: 1903px;">
						<!-- ngIf: permission.view['财务管理'].sub['财务信息'] -->
						<li ng-if="permission.view['财务管理'].sub['财务信息']" class="ng-scope">
							<a href="./caiwu.html" ui-sref-active="active" ui-sref="agent.finance.trade" class="">财务信息</a>
						</li>
						<!-- end ngIf: permission.view['财务管理'].sub['财务信息'] -->
					</ul>
				</li>
				<!-- end ngIf: permission.view['财务管理'] -->
			</ul>
			<div class="user">
				<div class="user-avatar"></div>
				<div class="user-info">
					<p ng-bind="advUser.loginName" class="ng-binding">昌投网络科技-C1</p>
					<p ng-bind="advUser.name" class="ng-binding">上海昌投网络科技有限公司1</p>
				</div>
				<ul class="user-list">
					<li class="ng-binding">余额：</li>
					<li ng-show="permission.act['退出登录']" ng-click="logout()" class="">退出登录</li>
				</ul>
			</div>
		</div>

		<div class="creative-page page ng-scope">
			<h3 class="page-title">素材信息</h3>
			<div class="filter-box clearfix">
				<div class="fr">
					<div class="dropdown dropdown-filter ng-isolate-scope" ng-class="{disabled:disabled}" list="stateList" callback="selectState"> <button class="btn btn-default dropdown-toggle cl" data-toggle="dropdown"> <span
                                        style="width: 55%; display: inline-block;" class="ng-binding" id="showState">全部审核状态</span>
                         
                                </button> <span class="caret"></span>
						<ul class="dropdown-menu">

							<li class="cl ng-scope" ng-repeat="item in list" onclick="clickFunc(this)">
								<a title="全部审核状态" href="javascript:;" class="ng-binding" data-state=null>全部审核状态</a>

							</li>
							<li class="cl ng-scope" ng-repeat="item in list" onclick="clickFunc(this)">
								<a title="待审核" href="javascript:;" class="ng-binding" data-state='0'>待审核</a>
							</li>
							<li class="cl ng-scope" ng-repeat="item in list" onclick="clickFunc(this)">
								<a title="审核通过" href="javascript:;" class="ng-binding" data-state='1'>审核通过</a>
							</li>
							<li class="cl ng-scope" ng-repeat="item in list" onclick="clickFunc(this)">
								<a title="审核拒绝" href="javascript:;" class="ng-binding" data-state='2'>审核拒绝</a>
							</li>
						</ul>
					</div>
					<div class="search ng-isolate-scope" value="filter.name" callback="search" placeholder="请输入素材名称"> <input class="form-control search-input ng-pristine ng-untouched ng-valid ng-empty" type="text" ng-model="value" placeholder="请输入素材名称" id="suCaisearch" onkeydown='if(event.keyCode==13){shuRuSuCai()}'> <i class="search-icon" onclick="shuRuSuCai()"></i> </div>

				</div>
			</div>
			<div class="table-box creative-table">
				<div class="table-title">
					<h3 class="table-title-font">素材信息</h3>
				</div>
				<table class="table spaceTable">
					<thead>
						<tr>
							<th style="text-align:center;">素材</th>
							<th>创意信息</th>
							<th>素材内容</th>
							<th>审核状态</th>
						</tr>
					</thead>
					<tbody ng-repeat="i in list" on-finish-render="" class="ng-scope" id="suCaiList_box">
						<tr>
							<td class="spaceInfo">
								<div class="material-cover ng-scope" ng-if="i.hasImg" ng-style="{'background-image':'url('+i.preview+')'}" style="background-image: url(&quot;http://res1.hubcloud.com.cn/dsp/ad/2018/11/6/1541500217278.jpg&quot;);">
									<div class="material-cover-mask" ng-click="showImg(i.preview)"></div>
								</div>
							</td>
							<td class="spaceInfo">
								<span class="ng-binding">创意名称：640*100</span><br><br>
								<span class="ng-binding">创意ID：89899</span><br><br>
								<span class="ng-binding">广告位类型：banner</span><br><br>
								<span class="ng-binding">交互方式：</span><br><br>
							</td>
							<td class="spaceContent">
								<div ng-repeat="m in i.material" class="ng-scope">
									<div ng-if="m.image" class="ng-scope">
										<span>图片：</span>
										<a href="javascript:;" ng-click="showImg(m.image.url)">查看图片</a><br><br>
									</div>
								</div>
								<div class="ng-binding">
									
									曝光监测：<br><br>
									
								</div>
							</td>
							<td class="btns">
								<span class="audit audit-orange">
                                            内审状态
                                            <span class="audit-text ng-binding">
                                                审核通过
                                            </span>
								</span>
								<span class="audit audit-blue">
                                            待审核的平台
                                            <span class="audit-text ng-binding">
                                                0
                                            </span>
								</span>
								<span class="audit audit-green">
                                            通过审核的平台
                                            <span class="audit-text ng-binding">
                                                1
                                                <ul class="adx-tips ng-scope"
                                                    ng-if="i.adxAuditList.approved.length > 0">
                                                    <li ng-repeat="a in i.adxAuditList.approved"
                                                        class="ng-binding ng-scope">自有ADX</li>
                                                </ul>
                                            </span>
								</span>
								<span class="audit audit-red">
                                            审核拒绝的平台
                                            <span class="audit-text ng-binding">
                                                0
                                            </span>
								</span>
							</td>
						</tr>
					</tbody>
				</table>
				<div class="page" id="pageToolbar">
					<div id="Paging_03779053995874404" class="ui-paging-container">
						<ul>
							<li class="js-page-first js-page-action ui-pager ui-pager-disabled">首页</li>
							<li class="js-page-prev js-page-action ui-pager ui-pager-disabled">上一页</li>
							<li data-page="1" class="ui-pager focus">1</li>
							<li class="ui-paging-toolbar"><span>跳转到</span><input type="text" class="ui-paging-count" value="1"> 页
								<select class="ui-select-pagesize">
									<option value="20">每页展示20条/页</option>
									<option value="50">每页展示50条/页</option>
									<option value="100">每页展示100条/页</option>
								</select><span> </span></li>
							<li class="js-page-last js-page-action ui-pager ui-pager-disabled">末页</li>
							<li class="js-page-next js-page-action ui-pager ui-pager-disabled">下一页</li>
						</ul>
					</div>
				</div>
			</div>

			<div class="iframe-box">
				<iframe srcdoc="" frameborder="0"></iframe>
			</div>
			<div class="video-box">
				<video controls=""></video>
			</div>
		</div>

	</body>

</html>
<script src="../res1.hubcloud.com.cn/lib/jquery/jquery.min.js"></script>
<script src="js/js_1.js"></script>
<script src="../res1.hubcloud.com.cn/lib/layer/layer.js"></script>

<script>
	var page = 1; //第几页
	var pageSize = 20; //一页多少条
	var state = null; //全部审核状态
	var name = ""; //素材创意名称
	var allPageNum = ''; //总页数
	$(function() {
		$('.dropdown').on('click', function() {
			if($(this).hasClass("open")) {
				$(this).removeClass('open');
			} else {
				$('.dropdown').removeClass('open');
				$(this).addClass('open');
			}
		})
		queryOriPage(page, pageSize, name, state);

	})

	//获取素材信息
	// originalityName	string
	// 创意名称

	// page	integer($int32)
	// example: 1
	// 页数:默认第一页

	// pageSize	integer($int32)
	// example: 10
	// 页码:默认十条信息

	// state	integer($int32)
	// 状态 0.待审核 1.审核通过 2.审核拒绝

	function queryOriPage(page, pageSize, name, state) {
		var d = {};
		d.page = page;
		d.pageSize = pageSize;
		d.originalityName = name;
		d.state = state;
		$.ajax({
			type: "POST",
			url: url + "/advertiser/adOrderOri/queryOriPage",

			//		参数需转为字符串
			data: JSON.stringify(d),

			//		json跨域
			dataType: 'json',
			//		contentType类型为json
			contentType: "application/json",

			//		请求头加上X-Token 
			beforeSend: function(XMLHttpRequest) {
				//		token 为页面所获取
				let token = sessionStorage.getItem("token");
				XMLHttpRequest.setRequestHeader("X-Token", token);
			},
			useDefaultXhrHeader: false,
			success: function(result) {
				console.log(result);
				$('#suCaiList_box').html('');
				let html = '';
				let listData = result.data.rows;
				listData.forEach(function(item,index) {
					let state = item.state;
					
					if(state == 0) {
						state = '待审核';
					} else if(state == 1) {
						state = '审核通过';
					} else {
						state = '审核拒绝';
					}
					let originalityType = item.originalityType;
					let isImg = "图片";
					let isshowImg = 'showImg';
					if(originalityType == 2){
						originalityType = 'showImg2';
						isImg = "视频";
						isshowImg = "showImg2";
					}else{
						originalityType = 'showImg';
					}
					
					let originalityAdType = item.originalityAdType;
					if(originalityAdType == 0){
						originalityAdType = '开屏';
					}else if(originalityAdType == 1){
						originalityAdType = '插屏';
					}else if(originalityAdType == 2){
						originalityAdType = 'Banner';
					}else{
						originalityAdType = '原生';
					}
					
					let squeezePage = item.squeezePage;
					if(!squeezePage){
						squeezePage = "";
					}
					
					html += `
                    <tr>
                        <td class="spaceInfo">
                            <div class="material-cover" style="background-image: url(&quot;${item.photoUrl}&quot;);">
                                <div class="material-cover-mask" onclick="${isshowImg}(this)"></div>
                                <input type="hidden" value="${item.photoUrl}"/>
                            </div>
                        </td>
                        <td class="spaceInfo">
                            <span>创意名称：${item.originalityName}</span><br><br>
                            <span>创意ID：${item.id}</span><br><br>
                            <span>广告位类型：${originalityAdType}</span><br><br>
                            <span>交互方式：仅展示</span><br><br>
                        </td>
                        <td class="spaceContent">
                            <div>
                                <div>
                                    <span>${isImg}：</span>
                                    <a href="javascript:;" onclick="${originalityType}(this)">查看${isImg}</a>
                                    <input type="hidden" value="${item.photoUrl}"/>
                                    <br><br>
                                </div>
                            </div>
                            <div>
                                
                                曝光监测：${item.exposureMonitor}<br><br>
                               
                            </div>
                            <div>
                            	落地页:<a href="${squeezePage}" style="color:#00aaee;">${squeezePage}</a>
                            </div>
                        </td>
                        <td class="btns">
                            <span class="audit audit-orange">
                                内审状态
                                <span class="audit-text">
                                    ${state}
                                </span>
                            </span>
                          
                        </td>
                    </tr>
                            `;
				})
				$('#suCaiList_box').append(html);
			},
			err: function(err) {
				layer.msg("请求失败");
			},
			complete: function() {
				
			}
		});
	}

	function showImg(obj) {
		let src = $(obj).next().val();

		layer.open({
			type: 1,
			title: false,
			closeBtn: 0,
			area: '516px',
			skin: 'layui-layer-nobg', //没有背景色
			shadeClose: true,
			content:'<img src="' + src + '"></img>'
			
		});
	}
	
	function showImg2(obj) {
		let src = $(obj).next().val();

		layer.open({
			type: 1,
			title: false,
			closeBtn: 0,
			
			skin: 'layui-layer-nobg', //没有背景色
			shadeClose: true,
			content:'<video width="320" height="240" controls><source src="'+src+'" type="video/mp4"><source src="'+src+'" type="video/ogg"></video>'
			
		});
	}

	function clickFunc(e) {
		$('#showState').text($(e).children('a').text());
		state = $(e).children('a').attr('data-state');

		queryOriPage(page, pageSize, name, state);
	}

	//回车搜索素材名称
	function shuRuSuCai() {
		name = $('#suCaisearch').val();
		queryOriPage(page, pageSize, name, state);  
	}

	$('.user').on('click', function() {
		$(this).toggleClass('hover');
	})

	$('.user').mouseleave(function() {
		$(this).removeClass('hover');
	});
</script>
<script src="../../oem/js/oem.js"></script>